<template>
	<view>
		<view class="header">
			<view class="header_text">
				<view >
					<span class="meeting_name" style="font-size: 40rpx;">{{reserve.meetingName}}</span>
				<span class="reserveRed" v-if="reserve.reserveEntityList[0].status===0">未审核</span>
				<span class="reserve" v-else-if="reserve.reserveEntityList[0].status===1">已通过</span>
				<span class="reserveRed" v-else>未通过</span>
				</view>
				<view  style="font-size: 30rpx;">容纳人数：{{reserve.people}} 				</view>
				<view  style="font-size: 30rpx;">位置：{{reserve.building}}号楼 {{reserve.room}}</view>
			</view>
		</view> 
		<view>
			<view class="tag" >
				<span @click="box1 = false"  style="font-size: 30rpx;">查看</span>
				<span @click="box1 = true"   style="font-size: 30rpx;" >审核</span>
			</view>
			<view v-show="box1">
				<view class="reserveInfo">
					<view style="color: #2979FF;">预约详细信息</view>
					<span>id:{{reserve.reserveEntityList[0].id}}</span>
					<span>申请人:{{reserve.reserveEntityList[0].applyId}}</span>
					<span>预约日期:{{reserve.reserveEntityList[0].reserveTime}}</span>
					<span>开始时间:{{reserve.reserveEntityList[0].reserverBegin}}</span>
					<span>结束时间:{{reserve.reserveEntityList[0].reserverEnd}}</span>
					<span>主题:{{reserve.reserveEntityList[0].subject}}</span>
					<span>创建时间:{{reserve.reserveEntityList[0].createTime}}</span>
				</view>
				<u-button @click="handleReserve(reserve)" v-show="reserve.reserveEntityList[0].status!=1" style="border-radius: 10%;width: 350rpx;background-color: #53C21D;">审核</u-button>
			</view>		
			<view v-show="!box1" class="info">
				<view class="left">
					<view style="color: #2979FF;">会议室详细信息</view>
					<span>会议室id:{{reserve.id}}</span>
					<span>会议室名称:{{reserve.meetingName}}</span>
					<span>房间号:{{reserve.room}}</span>
					<span>楼栋:{{reserve.building}}</span>
					<span>可容纳人数:{{reserve.people}}</span>
					<span>描述:{{reserve.description}}</span>
					<span>创建时间:{{reserve.createTime}}</span>
				</view>

			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				box1:false,
				reserve:'',
				subject:'',
				time:''
			}
		},
		onLoad(options) {
			console.log(JSON.parse(decodeURIComponent(options.reserve)))
			this.reserve = JSON.parse(decodeURIComponent(options.reserve))
		},
		methods: {
		handleReserve(reserve){
			uni.showModal({
				title:'选择',
				confirmColor:'确认审核通过?',
				cancelText:'不通过',
				cancelColor:'red',
				confirmText:'通过',
				confirmColor: '#2979FF',
				success(res) {
					if(res.confirm){
						uni.request({
							url:'/api/reserve/judgeReserve?id='+reserve.reserveEntityList[0].id+'&status='+1,
							method:'get',
							success() {
								uni.showToast({
									icon: 'success',
									position: 'bottom',
									title: '审核成功！'
								})
							},
							fail(error) {
								uni.showToast({
									icon: 'success',
									position: 'bottom',
									title: '审核失败！'+error
								})
							}
						})
					}else{
						uni.request({
							url:'/api/reserve/judgeReserve?id='+reserve.reserveEntityList[0].id+'&status='+2,
							method:'get',
						})
					}
					uni.navigateBack({
						delta:1
					})
				}
			})
		}
		}
	}
</script>

<style>
	.tag{
		height: 100rpx;
		font-size: 33rpx;
		display: flex;
		margin: 10rpx;
		background-color: #ffaa7f;
		border-radius: 10rpx;
		align-items: center;
	}
	.tag span{
		margin: 150rpx;
	}

	.info{
		font-size: 40rpx;
		display: flex;
		flex-direction: row;
	}
	.left{
		display: flex;
		flex-direction: column;
		height: 500rpx;
		margin: 10rpx;		
	}
	.left span{
		font-size: 30rpx;
		display: flex;
		flex-direction: column;
		height: 500rpx;
		margin: 20rpx;
	}
	.right{
		margin-left: 50rpx;
		height: 500rpx;
	}
	.right_item{
		border: 1px solid #dddddd;
		background-color: #53C21D;
		border-radius: 10rpx;
	}
.header{
	margin: 0;
	display: flex;
	flex-direction: column;
	height: 300rpx;
	background-color: #2979FF;
}
.reserveInfo{
	font-size: 38rpx;
	display: flex;
	flex-direction: column;
	height: 700rpx;
	margin: 20rpx;
}

.reserveInfo span{
	font-size: 30rpx;
	display: flex;
	flex-direction: column;
	height: 500rpx;
	margin: 20rpx;
}
.header .header_text{
	font-size: 10rpx;
	margin-top:150rpx;
	margin-left: 50rpx;
	margin-right: 50rpx;
	height: 130rpx;
	border-radius: 10rpx;
	background-color: white;
}
.meeting_name{
	margin-right: 400rpx;
}
.reserve{
	background-color: #aaff00;
	border-radius: 10rpx;
	margin-top: 1rpx;
	padding: 4rpx;
}
.reserveRed{
	background-color: #ff5500;
	border-radius: 10rpx;
	margin-top: 13rpx;
	padding: 4rpx;
}

</style>
